<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ page import="com.kaplan.hackathon.models.Content" %>   
<%@ page import="com.kaplan.hackathon.models.SimpleChoice" %>        
<%@ page import="java.util.List" %>

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js">
<!--<![endif]-->
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title></title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width">
    <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/main.css">
    <link rel="stylesheet" href="css/flexi.css">
    <script src="js/vendor/modernizr-2.6.2.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
	<script
	src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
	
	    
</head>
<body>
    <!--[if lt IE 7]>
            <p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
        <![endif]-->

    <!-- Add your site or application content here -->
    <header class="head">
        <div class="head-item">
			<a class="url home bookmark" href="dash" rel="home">
				<h1 id="site-title" class="ir logo">KAPLAN TECH SKILLS</h1> </a>
		</div>
        <div class="navbar head-item">
            <nav>
                <a href="learn">Read</a>
                <a href="video_connect">Watch</a>
                <a href=connect>Connect</a>
                <a href="practice">Practice</a>
                <a href="perform">Become an Expert</a>
                <span class="searchbox">
                    <input type="text" placeholder="search"/>
                    <button class="ir">&nbsp;</button>
                </span>
            </nav>
        </div>        
    </header>
    <div id='main' class="learn">
        <article>
            <section class="control">
                <div class="learntitle">
                    <div class="learntitle-item bluetxt titletxt">Microsoft Excel Basics</div>
                    <div class="learntitle-item tselectbar">
                        <!-- span>I'd like to </span>
                        <button class="tselect rndbtn">READ</button-->
                    </div>
                </div>
                <div class="objtitle">
                    <span class="bluetxt">LEARNING OBJECTIVE:</span>
                    <span class="titletxt">USE SUMIF TO SUM VALUES</span>
                </div>                
            </section>
            <section class="midmain learnnav">
                <!-- <aside class="learnnav-item">
                    <button class="ir backbtn">&nbsp;</button>
                </aside> -->
                <div class="paginate on" id="21b018ba-8def-4906-b49b-e82b917f7e2c">1</div>
                <div class="paginate" id="7e9a3fd5-98c0-4f0b-b173-8ac375491e06">2</div>
                <div class="paginate" id="2d3c25ff-898c-4d3d-a96e-c63646497d02">3</div>
                <div class="paginate" id="c0d06958-a847-4218-a32c-0ad5ebded256">4</div>
                <div id="question" style='margin-top:40px;margin-left:-40px'>
                <iframe name="iframe" id="login" style='display:none' src='http://www.learningpod.com/saf/SocialAuth?id=facebook' ></iframe>
                    
    			<iframe name="iframe" id="iframe" width="1050" height="800" ></iframe> 
                </div> 
                <%--
                <div id="question">
                <%
                Content lpContent = (Content)request.getAttribute("lpContent");%>
                <table>
                <tr>
                <td colspan="2">
                 <%=lpContent.getQuestion()%>
                </td>
                </tr>
                 <tr>
                 <td style="width:228px"><img src = "http://img855.imageshack.us/img855/7039/j7.png" /> </td>
                 <td><%List<SimpleChoice> choices = lpContent.getAnswerList();
                for(int i=1 ;i<choices.size();i++ ){%>
                	<%=String.valueOf((char)(i + 64))%> &nbsp; &nbsp; <input type="radio" name="group1" ><%=choices.get(i).getAnswer()%> </input>  <br/>
                <%}%></td>
                 </tr>
                 </table>
               
                </div> --%>
                
            </section>
            
                
        </article>
    </div>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.9.1.min.js"><\/script>')</script>
    <script>
    $(".paginate" ).click(function() {
    	//var searchParam = encodeURIComponent($("#searchQuery" ).val());
    	var questionId = ($(this).attr('id'));
    	//alert(questionId);
    	/* $.get('getQuestion?uuid=' + questionId, function(data) {
    		
    			var qString = questionId;
    			$('#"question"').html(qString);
    			
    	}); */
    	$(".paginate" ).removeClass('on');
    	$(this).addClass('on');
    	$('#iframe').attr('src', 'http://www.learningpod.com/question/' + questionId);
    	
    });
    $("#login").load(function(){
    	$('#iframe').attr('src', 'http://www.learningpod.com/question/21b018ba-8def-4906-b49b-e82b917f7e2c');
    });

    </script>
    	
    	
    <script src="js/plugins.js"></script>
    <script src="js/main.js"></script>
    <script src="js/learn.js"></script>

    <!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
    <script>
        var _gaq = [['_setAccount', 'UA-XXXXX-X'], ['_trackPageview']];
        (function (d, t) {
            var g = d.createElement(t), s = d.getElementsByTagName(t)[0];
            g.src = '//www.google-analytics.com/ga.js';
            s.parentNode.insertBefore(g, s)
        }(document, 'script'));
    </script>
</body>
</html>
